<#import "function.ftl" as func>
<#assign package=model.variables.package>
<#assign class=model.variables.class>
<#assign classVar=model.variables.classVar>
<#assign comment=model.tabComment>
<#assign subtables=model.subTableList>
<#assign pk=func.getPk(model) >
<#assign pkModel=model.pkModel >
<#assign pkVar=func.convertUnderLine(pk) >
<#assign pkType=func.getPkType(model)>
<#assign fkType=func.getFkType(model)>
<#assign system=vars.system>
<#assign domain=vars.domain>
<#assign tableName=model.tableName>
<#assign colList=model.columnList>
<#assign commonList=model.commonList>
<#assign subSize=func.hasSubTable(model)>

<template>
    <rx-dialog @ok="handleSubmit" @cancel="cancel">
        <rx-layout>
            <template #middle>
                <a-form ref="form"  :model="mdl" :rules="rules" layout="vertical" class="rx-a-form-vertical">
                    <#list commonList as col>
                        <#assign colName=func.convertUnderLine(col.columnName)>
                        <#if func.isExcludeField(colName) >
                    <a-row>
                        <a-col :span="24">
                            <#if colName?if_exists?string=="name">
                                <a-form-item  label="${col.comment}" name = "${colName}">
                                    <a-input placeholder="请输入${col.comment}" v-model:value="mdl.${colName}"/>
                                </a-form-item>
                            <#else>
                                <a-form-item  label="${col.comment}" name = "${colName}">
                                    <#if (col.colType=="java.util.Date")>
                                        <a-date-picker placeholder="请输入${col.comment}" v-model:value="mdl.${colName}"
                                                       format="YYYY-MM-DD"/>至
                                        <a-date-picker placeholder="请输入${col.comment}" v-model:value="mdl.${colName}"
                                                       format="YYYY-MM-DD"/>
                                    <#elseif (col.colType=="Integer")>
                                        <a-input-number :min="0" :max="1000000" placeholder="请输入${colName}"
                                                        v-model:value="mdl.${colName}"/>
                                    <#else>
                                        <a-input placeholder="请输入${col.comment}" v-model:value="mdl.${colName}"/>
                                    </#if>
                                </a-form-item>
                            </#if>
                        </a-col>
                    </a-row>
                        </#if>
                    </#list>
                </a-form>


                <#if (subSize?number  gt 0) >
                    <#assign subtables=model.subTableList>
                    <#list subtables as subTable>
                        <a-button class="editable-add-btn" @click="handleAdd('${subTable.variables.classVar}')">
                            {{$ti18('rxList.add', '新增')}}
                        </a-button>
                        <rx-grid :hasPage="false"
                                 :selectConfig="selectConfig"
                                 :data="mdl['${subTable.variables.classVar}']"
                                 field="pkId"
                                 :columns="subTable.${subTable.variables.classVar}.columns"
                                 :height="'auto'">
                            <template v-for="col in subTable['${subTable.variables.classVar}'].fields"
                                      #[col]="{row}">
                                <div :key="col">
                                    <a-input
                                        v-if="row.editable"
                                        style="margin: -5px 0"
                                        :value="row[col]"
                                        @change="e => handleChange(e.target.value, row.pkId, col,'${subTable.variables.classVar}')"/>
                                    <span v-else>
                                        {{ row[col] }}
                                    </span>
                                </div>
                            </template>
                            <template #action="{ row }">
                                <RxGridAction :size="2">
                                    <span v-if="row.editable" @click="saveChild(record.pkId,'${subTable.variables.classVar}')">保存</span>
                                    <span @click="edit(record.pkId,'${subTable.variables.classVar}')">编辑</span>
                                    <span @click="onDelete(record.pkId,'${subTable.variables.classVar}')">删除</span>
                                </RxGridAction>
                            </template>
                        </rx-grid>
                    </#list>
                </#if>
            </template>
        </rx-layout>
    </rx-dialog>
</template>
<script>
    import ${class}Api from '@/common/api/${system}/${package}/${classVar}'
    import {RxDialog,BaseFormModel} from 'jpaas-base-lib';


    export default {
        name: '${class}Edit',
        mixins:[BaseFormModel],
        components: {
            RxDialog,
        },
        data(){
            return {
                /**
                 * 子表列表，以及表格属性
                 */
                subTable:{
                    <#if (subSize?number  gt 0) >
                    <#assign subtables=model.subTableList>
                    <#list subtables as subTable>
                    "${subTable.variables.classVar}": {
                        row:{
            <#list subTable.columnList as col>
            <#assign colName=func.convertUnderLine(col.columnName)>
            <#if func.isExcludeField(colName) >
            <#if colName?if_exists?string!="id" && colName?if_exists?string!="fkid" >
            ${colName}:'',
                </#if>
                </#if>
                </#list>
                editable: true,
        },
            selectConfig: {
                type: 'checkbox'
            },
            columns:[
                <#list subTable.columnList as col>
                <#assign colName=func.convertUnderLine(col.columnName)>
                <#if func.isExcludeField(colName) >
                {
                    title: '${col.comment}',
                    field: '${colName}',
                    minWidth: 100,
                    allowCellEdit: false,
                    slots: { default: '${colName}' },
                },
                </#if>
                </#list>
                {
                    title: this.$ti18('rxList.action', '操作'),
                    field: 'action',
                    minWidth:120,
                    allowCellEdit: false,
                    slots: { default: 'operation' },
                },
            ],
                fields:[
                <#list subTable.columnList as col>
                <#assign colName=func.convertUnderLine(col.columnName)>
                <#if func.isExcludeField(colName) >
                '${colName}',
                </#if>
                </#list>
            ]
        },
            </#list>
            </#if>
        },
            rules: {
                <#list commonList as col>
                <#assign colName=func.convertUnderLine(col.columnName)>
                <#if func.isExcludeField(colName) >
                <#assign isNotNull=col.getIsNotNull()?string("true","false") >
                ${colName}: [{ required:${isNotNull},message:"请输入${col.comment}", trigger: 'change' }],
                </#if>
                </#list>
            }
        }

        },
        methods: {
            get(id){
                return ${class}Api.get(id);
            },

            save(){
                return ${class}Api.save(this.mdl);
            },

        }
    }
</script>
<style scoped>

</style>
